<template>
  <a-select
    :value="value"
    :dropdown-match-select-width="false"
    :placeholder="placeholder || t('请选择学科')"
    :disabled="disabled"
    :loading="state.loading"
    @update:value="(v) => emit('update:value', v)"
    allow-clear
  >
    <a-select-option
      v-for="item in state.list"
      :value="item.subjectCode"
      :key="item.subjectCode"
    >
      <span>{{ item.subjectName }}</span>
      <span style="float: right; margin-left: 16px; color: #999999">{{
        item.subjectCode
      }}</span>
    </a-select-option>
  </a-select>
</template>
<script lang="ts" setup>
import { queryByList } from "@/api/answer/base-data/subject";
import { useFetchList } from "@/hook/useFetchList";
import { useI18n } from "vue-i18n";

interface Props {
  /**绑定值 */
  value: string;
  /**占位文本 */
  placeholder?: string;
  /**禁用 */
  disabled?: boolean;
}
defineProps<Props>();
const emit = defineEmits(["update:value"]);
const { t } = useI18n();
const { state } = useFetchList(queryByList);
</script>
